// pages/my/my.js
import {
  ComponentWithStore
} from 'mobx-miniprogram-bindings'

import {
  InfoStore
} from '@/stores/InfoStore'

import {
  env
} from '@/utils/env'

import {
  reqUpdateName,
  reqGetInfo
} from '@/api/user'

import {
  store
} from '@/stores/store' // 引入仓库store

import {
  setStorage,
  getStorage
} from '@/utils/storage'


import {
  toast
} from '@/utils/extend'
import Schema from 'async-validator'
const appInstance = getApp()

ComponentWithStore({
  /**
   * 页面的初始数据
   */
  data: {
    newName: '',
    ifUpdate: false,
    nameError: "",
    avatarUrl: "",
    name: ""
  },

  storeBindings: [{
      store: store,
      fields: ["activeTabBar"],
      actions: ["updateActive"]
    },
    {
      store: InfoStore,
      fields: ['isRegister', 'userInfo'],
      actions: ['setUserInfo']
    }
  ],

  methods: {
    truncateText(text) {
      if (text && text.length > 8) {
        return text.substring(0, 8) + '...'; // 超过10个字符，加省略号
      }
      return text; // 如果小于或等于10个字符，直接返回
    },
    /* 校验昵称 */
    Validator() {
      this.onValidator()
    },
    /* 校验昵称 */
    onValidator() {
      const rules = {
        newName: [{
            required: true,
            message: '昵称不能为空'
          },
          {
            max: 20,
            message: '昵称不得超过20个字'
          }
        ]
      }

      // 需要对构造函数进行实例化，同时传入验证规则
      const validator = new Schema(rules)

      validator.validate(this.data, (errors, fields) => {
        if (errors) {
          // console.log('验证失败')
          // console.log(errors)
          // console.log(fields)

          /* 如果用户昵称字数超过 */
          this.setData({
            nameError: errors[0].message
          })

        } else {
          this.setData({
            nameError: ''
          })
          console.log('验证成功')
        }
      })
    },


    async onShow() {
      this.setData({
        isRead: appInstance.globalData.isRead,
      })
      this.getUserInfo()

    },

    /* 点击修改头像 */
    uploadAvatar(filePath) {
      console.log(filePath)
      const token = getStorage('token')
      wx.uploadFile({
        url: `${env.baseURL}/user/upload`,
        filePath: filePath, // 需要上传的文件路径
        name: 'file', // 对应接口中的文件字段名称，一般是 "file"
        formData: {
          'user': 'test', // 其他附加参数，可以根据需求传递
          'type': 'avatar', // 传递文件类型标识（如头像上传）
        },
        header: {
          'satoken': token, // 在请求头中添加 'satoken'
        },
        success: (res) => {
          // 处理上传成功的结果
          const data = JSON.parse(res.data); // 假设接口返回的是JSON格式数据
          console.log(data)

          if (data.code == 200) {
            this.setData({
              avatar: filePath
            })
            toast({
              title: '上传成功',
              icon: 'success',
            });
          } else {
            toast({
              title: '上传失败',
              icon: 'none',
            });
          }
        },
        fail: (err) => {
          toast({
            title: '上传失败，请稍后再试',
            icon: 'none',
          });
          console.error('上传失败：', err);
        },
      });
    },

    // 更新用户头像
    async chooseAvatar(event) {
      const {
        avatarUrl
      } = event.detail
      console.log(event)
      this.uploadAvatar(avatarUrl)
      // 重新获取用户信息
      this.getUserInfo()
    },

    /* 点击修改昵称 */
    updateNickname() {
      this.setData({
        ifUpdate: true
      })
    },


    /* 取消修改昵称 */
    cancel() {
      this.setData({
        ifUpdate: false,
        newName: '',
        nameError: ''
      })
    },

    /* 保存昵称修改 */
    async save() {
      this.onValidator()
      if (!this.data.nameError) {
        console.log(this.data.newName)
        const res = await reqUpdateName(this.data.newName)

        if (res.code == 200) {
          const truncateName = this.truncateText(this.data.newName)
          this.setData({
            name: truncateName
          })
          toast({
            title: '上传成功',
            icon: 'success',
          });
        } else {
          toast({
            title: '上传失败',
            icon: 'none',
          });
        }
        console.log(res)
        this.setData({
          ifUpdate: false,
          newName: '',
          nameError: ''
        })
        this.getUserInfo()
      }
    },

    // 更新用户信息
    async getUserInfo() {
      const {
        data
      } = await reqGetInfo()
      // console.log(data)
      const truncateName = this.truncateText(data.wxName)
      this.setData({
        name: truncateName,
        avatar: data.profilePhoto
      })

      // 将用户信息存储到本地
      setStorage('userInfo', data)

      // 将用户信息存储到 Store 对象
      this.setUserInfo(data)


      // console.log("执行")

    },


    /* 去报名信息 */
    gotoProgress() {
      if (this.data.isRegister) {
        wx.navigateTo({
          url: '/pages/formDetail/formDetail',
        })
      } else {

        wx.switchTab({
          url: '/pages/schedule/schedule',
        })
        // 手动更新tabBar光标
        this.updateActive(1)
      }
    },

    /* 去通知公告 */
    gotoInform() {
      wx.navigateTo({
        url: '/modules/inform/pages/inform-page/inform-page',
      })
    },

    /* 联系我们 */
    handleContact(e) {
      console.log(e.detail.path)
      console.log(e.detail.query)
    }
  }
})